<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="cache-control" content="no-cache">
<title data-i18n-content="title"></title>
<base id="baseTarget" target="_top">
<link id="globeCss" type="text/css" rel="stylesheet" href="css/base.css">
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/jquery.dragsort-0.5.1.js"></script>
<script type="text/javascript" src="js/mobilyblocks.js"></script>
<script type="text/javascript" src="js/init.js"></script>
</head>

<body>

<div hidefocus="true" tabindex="0" title="切换壁纸" id="dvDockStartOuter" class="kI">
	<div id="dvDockStart" class="mW"> 
		<span class="ld js"></span> 
		<span class="ld iW"></span> 
		<span class="ld iX"></span> 
		<span class="ld iY"></span>
		<ul id="skin" class="reset">
			<li><a href="javascript:;"><img src="img/socials/img_sk_01.png" skin="url(img/skin/20120825_07.jpg)" alt="" /></a></li>
			<li><a href="javascript:;"><img src="img/socials/img_sk_02.png" skin="url(img/skin/20120825_02.jpg)" alt="" /></a></li>
			<li><a href="javascript:;"><img src="img/socials/img_sk_03.png" skin="url(img/skin/20120825_08.jpg)" alt="" /></a></li>
			<li><a href="javascript:;"><img src="img/socials/img_sk_04.png" skin="url(img/skin/20120825_03.jpg)" alt="" /></a></li>
			<li><a href="javascript:;"><img src="img/socials/img_sk_05.png" skin="url(img/skin/20120825_05.jpg)" alt="" /></a></li>
			<li><a href="javascript:;"><img src="img/socials/img_sk_06.png" skin="url(img/skin/20120825_06.jpg)" alt="" /></a></li>
		</ul>
	</div>
</div>

<div id="layout" class="layoutClick">
	<a href="javascript:;" title="控制面板"><img src="img/icn_tool.png"></a>
	<div id="setup" class="hidden">
		<a href="javascript:;" class="topClose" title="关闭"></a>
		<div class="setupBox">
				<div class="setupBoxStyle default">
						<div class="dialBoxNum">4</div>
						<div class="dialBoxNum">8</div>
						<div class="dialBoxNum">12</div>
						<div class="dialBoxNum">20</div>
				</div>
				<div class="setupBoxStyle circular">
						<div class="dialBoxNum">4</div>
						<div class="dialBoxNum">8</div>
						<div class="dialBoxNum">15</div>
						<div class="dialBoxNum">21</div>
				</div>
				<div class="setupBoxStyle square">
						<div class="dialBoxNum">4</div>
						<div class="dialBoxNum">8</div>
						<div class="dialBoxNum">15</div>
						<div class="dialBoxNum">21</div>
				</div>
				<div class="setupBoxStyle seamless">
						<div class="dialBoxNum">4</div>
						<div class="dialBoxNum">8</div>
						<div class="dialBoxNum">12</div>
						<div class="dialBoxNum">24</div>
				</div>
		</div>
	</div>
</div>


<input name="list1SortOrder" type="hidden">
<div id="body" class="wrapper">
	
	<section id="appBox_01">
		<dl class="itemBox" url="http://www.google.com.hk/">
			<dt class="itemImg" notes="谷歌" style="background-image:url(img/app/google.com.hk.png)">
				<div class="itemIcon" style="background-image:url(http://www.google.com.hk/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">谷歌<span class="hide"></span></dd>
		</dl>
	</section>
	
	<section id="appBox_02">
		<dl class="itemBox" url="http://www.baidu.com/">
			<dt class="itemImg" notes="百度" style="background-image:url(img/app/baidu.com.png)">
				<div class="itemIcon" style="background-image:url(http://www.baidu.com/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">百度<span class="hide"></span></dd>
		</dl>
	</section>
	
	<section id="appBox_03">
		<dl class="itemBox" url="http://www.163.com/">
			<dt class="itemImg" notes="网易" style="background-image:url(img/app/163.com.png)">
				<div class="itemIcon" style="background-image:url(http://www.163.com/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">网易<span class="hide"></span></dd>
		</dl>
	</section>
	
	<section id="appBox_04">
		<dl class="itemBox" url="http://www.sina.com/">
			<dt class="itemImg" notes="新浪" style="background-image:url(img/app/sina.com.cn.png)">
				<div class="itemIcon" style="background-image:url(http://www.sina.com.cn/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">新浪<span class="hide"></span></dd>
		</dl>
	</section>
	
	<section id="appBox_05">
		<dl class="itemBox" url="http://www.taobao.com/">
			<dt class="itemImg" notes="淘宝" style="background-image:url(img/app/taobao.com.png)">
				<div class="itemIcon" style="background-image:url(http://www.taobao.com/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">淘宝<span class="hide"></span></dd>
		</dl>
	</section>
	
	<section id="appBox_06">
		<dl class="itemBox" url="http://www.ifeng.com/">
			<dt class="itemImg" notes="凤凰" style="background-image:url(img/app/ifeng.com.png)">
				<div class="itemIcon" style="background-image:url(http://www.ifeng.com/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">凤凰<span class="hide"></span></dd>
		</dl>
	</section>
	
	<section id="appBox_07">
		<dl class="itemBox" url="http://www.qq.com/">
			<dt class="itemImg" notes="腾讯"  style="background-image:url(img/app/qq.com.png)">
				<div class="itemIcon" style="background-image:url(http://www.qq.com/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">腾讯<span class="hide"></span></dd>
		</dl>
	</section>
	
	<section id="appBox_08">
		<dl class="itemBox" url="http://www.huanqiu.com/">
			<dt class="itemImg" notes="环球" style="background-image:url(img/app/huanqiu.com.png)">
				<div class="itemIcon" style="background-image:url(http://www.huanqiu.com/favicon.ico);"></div>
			</dt>
			<dd class="itemTitle">环球<span class="hide"></span></dd>
		</dl>
	</section>
	
<!--	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="谷歌" style="background-image:url(img/app/google.com.hk.png)">
			<div class="itemIcon" style="background-image:url(http://www.google.com.hk/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">谷歌<span class="hide"></span></dd>
	</dl>
	
	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="百度" style="background-image:url(img/app/baidu.com.png)">
			<div class="itemIcon" style="background-image:url(http://www.baidu.com/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">百度<span class="hide"></span></dd>
	</dl>
	
	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="网易" style="background-image:url(img/app/163.com.png)">
			<div class="itemIcon" style="background-image:url(http://www.163.com/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">网易<span class="hide"></span></dd>
	</dl>
	
	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="新浪" style="background-image:url(img/app/sina.com.cn.png)">
			<div class="itemIcon" style="background-image:url(http://www.sina.com.cn/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">新浪<span class="hide"></span></dd>
	</dl>
	
	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="淘宝" style="background-image:url(img/app/taobao.com.png)">
			<div class="itemIcon" style="background-image:url(http://www.taobao.com/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">淘宝<span class="hide"></span></dd>
	</dl>
	
	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="凤凰" style="background-image:url(img/app/ifeng.com.png)">
			<div class="itemIcon" style="background-image:url(http://www.ifeng.com/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">凤凰<span class="hide"></span></dd>
	</dl>
	
	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="腾讯"  style="background-image:url(img/app/qq.com.png)">
			<div class="itemIcon" style="background-image:url(http://www.qq.com/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">腾讯<span class="hide"></span></dd>
	</dl>
	
	<dl class="itemBox" url="http://www.google.com.hk">
		<dt class="itemImg" notes="环球" style="background-image:url(img/app/huanqiu.com.png)">
			<div class="itemIcon" style="background-image:url(http://www.huanqiu.com/favicon.ico);"></div>
		</dt>
		<dd class="itemTitle">环球<span class="hide"></span></dd>
	</dl>-->
		
</div>

	<script type="text/javascript">
		$("#body").dragsort({ dragSelector: "dl", dragBetween: true, dragEnd: saveOrder, placeHolderTemplate: "<section class='placeHolder'><dl></dl></section>" });
		
		function saveOrder() {
			var data = $("#body section").map(function() { return $(this).attr("id"); }).get();
			$("input[name=list1SortOrder]").val(data.join("|"));
		};
	</script>
	
<footer>
	<div></div>
	<section>
		<ul id="navigation">
			<li id="app_webstore" url="https://chrome.google.com/webstore?hl=zh-CN"><span><img src="img/icon/icn_store.png"><a href="javascript:;">应用商店</a></span></li>
			<li id="app_video" url="chrome://video/"><span><img src="img/icon/icn_video.png"><a href="javascript:;">视频</a></span></li>
			<li id="app_weibo" url="chrome://weibo/"><span><img src="img/icon/icn_weibo2.png"><a href="javascript:;">微博</a></span></li>
			<li id="app_blog" url="chrome://news/"><span><img src="img/icon/icn_news.png"><a href="javascript:;">新闻</a></span></li>
			<li id="app_blog" url="chrome://blog/"><span><img src="img/icon/icn_blog.png"><a href="javascript:;">blog</a></span></li>
			<li id="app_bill" url="chrome://bill/"><span><img src="img/icon/icn_bill.png"><a href="javascript:;">研报</a></span></li>
			<li id="app_chart" url="chrome://chart/"><span><img src="img/icon/icn_chart.png"><a href="javascript:;">图表</a></span></li>
		</ul>		
	</section>
</footer>


<script type="text/javascript">
    //判断浏览器窗口大小
	$(window).resize(function() {
		var width = $(this).width();
		$('#navigation').stop().css("left",($(document.body).width()/2)-300);
		if(width<600){$('#navigation').hide()}else{$('#navigation').show()}
	});
		$(function() {
			$(".itemBox").click(
			function(){
				window.open($(this).attr("url"),"_self");
			});
			$("#navigation>li").click(
			function(){
				location.href=$(this).attr("url");
			});
			
			//切换皮肤
			$("#skin > li > a").click(function(){
				$("body").css("background-image",$(this).children("img").attr("skin"));
			});
			
			$("#layout").click(function(){
				$(this).css({ "z-index": "12", "width": "420px", "height":"80px" }).children("a").fadeOut(50);;
				$("#setup").children(".topClose").hide().end().fadeIn("slow").children(".topClose").show();
			});
			$("#setup > .topClose").live('click', function() {
				  $("#layout").css({ "z-index": "9", "width": "30px", "height":"24px" }).children("a").fadeIn("slow");;
				  $("#setup").css({'marginTop': '0px'}).hide();
				});
			
			//九宫格鼠标效果
			$("#body>section>dl").hover(
				function(){
					$(this).addClass("hover");
					$(this).children("dd").children("span").fadeTo("slow", 0.2);
					$(this).children("dd").fadeTo("slow", 1).setTimeout(50,$(this).children("dd").css("text-indent","0"));
				},function(){
					$(this).removeClass("hover");
					$(this).children("dd").children("span").fadeTo("slow", 0);
					$(this).children("dd").fadeTo("slow", 0).css("text-indent","-999em");
			});
				
            //下面工具栏定位
			$('#navigation').stop().css("left",($(document.body).width()/2)-300);
			$('#navigation span').stop().animate({'marginTop':'-2px'},1000);
			
			//工具栏鼠标效果
			$('#navigation > li').hover(
				function () {
					$('span',$(this)).stop().animate({'marginTop':'-35px'},200).addClass("over").children("a").css("color","#ff5500");
				},
				function () {
					$('span',$(this)).stop().animate({'marginTop':'-2px'},200).removeClass("over").children("a").css("color","#0066cc");
				}
			);
			
		});
</script>

</body>
</html>
